<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<title>xiaoxiannv</title>
	<link rel="shortcut icon" href="./img/bitbug_favicon.ico">
	<link rel="stylesheet" type="text/css" href="./css/touch.css">
	<link rel="stylesheet" type="text/css" href="./css/fonts.css">
	<link rel="stylesheet" type="text/css" href="./css/menu.css">
	<link rel="stylesheet" type="text/css" href="./css/welcome.css">
</head>
<body onselectstart="return false;" unselectable="on">
	<div class="lines">
		<div class="topline"></div>
		<div class="bottomline"></div>
		<div class="leftline"></div>
		<div class="rightline"></div>
	</div>                   <!-- 4 lines -->
	<div class="bcg-touch"></div>    <!-- fixed bcg -->
	<div class="text">
		<h1>get in touch</h1><br>
		<div class="line"></div><br>
		<h2>email to 1924205048@qq.com</h2><br>
		<div class="line"></div><br>
		<div class="icons">
			<div class="wechat icon">
				<img class="wechat code" src="./img/wechat0.png">
			</div>
			<div class="sina icon">
				<img class="sina code" src="./img/sina.png">
			</div>
			<div class="qq icon">
				<img class="qq code" src="./img/qq.png">
			</div>
		</div>
	</div>
	<!-- 以下按钮 -->
	<button class="navigation-trigger">
        <span class="icon-container">
          <span class="navigation-line navigation-line01"></span>
          <span class="navigation-line navigation-line02"></span>
          <span class="navigation-line navigation-line03"></span>
          <span class="navigation-line navigation-line04"></span>
        </span>
    </button>
	<!-- 以下菜单页面 -->
	<div id="menu_cover">
		<div class="main">
			<a href="index.html" class="board first">
				<h1>welcome</h1>
				<br>
				<div class="lightline"></div>
			</a>
			<div class="one"></div>
			<a href="about.html" class="board second">
				<h1>about</h1>
				<br>
				<div class="lightline"></div>
			</a>
			<div class="two"></div>
			<a href="touch.html" class="board third">
				<h1>contacts</h1>
				<br>
			</a>
			<div class="three"></div>
		</div>
	</div>

	<script type="text/javascript">
		var menuCover=document.getElementById('menu_cover');
		var body = document.getElementsByTagName('body')[0];
		var line = document.getElementsByClassName('navigation-trigger')[0];
		line.onclick=function(){
			toggleClass(body,"show-cover");
		};
		function hasClass(obj, cls) {  
    		return obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));  
		};
		function addClass(obj, cls) {  
		    if (!this.hasClass(obj, cls)) obj.className += " " + cls;  
		};  
		function removeClass(obj, cls) {  
		    if (hasClass(obj, cls)) {  
		        var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');  
		        obj.className = obj.className.replace(reg, ' ');  
		    }  
		};  
		function toggleClass(obj,cls){  
		    if(hasClass(obj,cls)){  
		        removeClass(obj, cls);  
		    }else{  
		        addClass(obj, cls);  
		    }  
		};  
	</script>
</body>
</html>